<template>
  <div id="app">
    <!-- 头部 -->
    <HeaderModule />
    <!-- 列表 -->
    <ContextModule />
    <!-- 页脚 -->
    <footer>{{copyRight}}</footer>
    <!-- 新建、编辑管理弹窗 -->
    <ManageModule />
    <!-- 日历视图 -->
    <CalendarViewModule />
    <!-- 通讯录 -->
    <MailListModule />
    <!-- 批量导入 -->
    <BatchImportModule />
  </div>
</template>

<script lang="ts">
import Vue from 'vue';
import '@/assets/style/index.scss';
import KeyboradCode from '@/lib/KeyboradCode';
import {Component} from 'vue-property-decorator';
import {mapState} from 'vuex';

import HeaderModule from '@/components/HeaderModule.vue';
import ContextModule from '@/components/ContextModule.vue';
import ManageModule from '@/components/ManageModule.vue';
import MailListModule from '@/components/MailListModule/index.vue';
import BatchImportModule from '@/components/BatchImportModule/index.vue';
import CalendarViewModule from '@/components/CalendarViewModule/index.vue';

@Component({
  components: {HeaderModule, MailListModule, ContextModule, ManageModule, CalendarViewModule, BatchImportModule},
  computed: {
    ...mapState({
      copyRight: (state: any) => state.copyRight,
      isAddManageIng: (state: any) => state.manage.visible === true,
      isCalendarView: (state: any) => state.CalendarViewModule.visible === true,
    }),
  },
  mounted() {
    // setTimeout(() => {
    //   this.$store.commit('CalendarViewModule/toggleVisible');
    //   this.$store.commit('MailListModule/toggleVisible');
    // }, 100);

    document.addEventListener('keyup', (event: KeyboardEvent) => {
      // console.log(event.keyCode);

      // ctrl+enter 触发保存逻辑
      if (this.isAddManageIng) {                        // 待办编辑器打开时
        if (event.ctrlKey && event.keyCode === KeyboradCode.enter) {  // ctrl+enter 保存待办
          this.$store.dispatch('saveManage');
        }
      } else if (this.isCalendarView) {                 // 日历视图时

      } else {                                          // 主页面
        if (event.ctrlKey && event.keyCode === KeyboradCode.m) {      // ctrl+m 新增待办
          this.$store.dispatch('openManage', 'add');
        }
      }
    });
  },
})
export default class App extends Vue {}
</script>
